 //定义
 .intro-loop(@n, @i: 1) when (@i <=@n) {
     .intro-@{i} {
         img {
             background-image: url("../images/intro-@{i}.jpg");
         }
     }

     .intro-loop(@n, (@i + 1));
 }

 //调用
 .introduction {
     .intro-loop(4);
 }

 .dhsw(@n, @i: 1) when (@i <=@n) {
     .dhs@{i} {

         display: block;
         display: -webkit-box;

         -webkit-line-clamp: @i;
         -webkit-box-orient: vertical;
         overflow: hidden;
         text-overflow: ellipsis;
     }

     .dhsw(@n, (@i + 1));
 }

 .mbt(@n, @i: 0) when (@i <=@n) {
     .mbt@{i} {
         margin-bottom: @i*1px;
     }

     .mbt(@n, (@i + 1));
 }

 .mt(@n, @i: 0) when (@i <=@n) {
     .mt@{i} {
         margin-top: @i*1px;
     }

     .mt(@n, (@i + 1));
 }

 .dhsw(5);
 .mbt(30);
 .mt(30);

 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
     -webkit-box-sizing: border-box;
     -moz-box-sizing: border-box;
 }

 html {
     min-width: 1220px;
 }

 body {
     font: 12px/18px "Microsoft YaHei", SimSun, "sans-serif", HELVETICA;
 }

 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
     font-size: 14px;
 }

 input,
 select,
 textarea {
     outline: none;
     border: none;
 }

 a,
 a:link,
 a:active,
 a:visited {
     text-decoration: none;
     outline: none;
 }

 *,
 *:before,
 *:after {
     -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
 }

 ol,
 ul {
     list-style: none;
 }

 fieldse,
 img {
     border: 0;
 }

 i,
 b,
 strong,
 em,
 strong,
 th,
 var {
     font-weight: normal;
     font-style: normal;
 }

 table {
     border-collapse: collapse;
     border-spacing: 0;
 }

 select {
     appearance: none;
     -moz-appearance: none;
     -webkit-appearance: none;
     -ms-appearance: none;
     outline: none;
 }

 /*清除浮动*/

 .clearfix:after,
 .flex:after {
     content: ".";
     display: block;
     height: 0;
     clear: both;
     visibility: hidden;
 }

 .flex,
 .clearfix {
     *zoom: 1;
 }

 /*浮动*/

 .fl {
     float: left;
 }

 .fr {
     float: right;
 }

 /* 解决input框记住密码后黄框问题 */

 input:-webkit-autofill {
     -webkit-box-shadow: 0 0 0px 1000px white inset;
 }


 img {
     max-width: 100%;
     height: auto;
     vertical-align: top;
 }

 .w(@n) {
     width: @n
 }

 @color: #098AD2;

 .main {
     .basew;
     margin: 0 auto;

 }

 .dn {
     display: none
 }

 .opci0 {
     opacity: 0;
 }

 .dh {

     text-overflow: ellipsis;
     white-space: nowrap;
     overflow: hidden;
 }

 .basew {
     .w(1080px);

     .swiper-pagination-bullet {
         background: #ffffff !important;
         opacity: 1 !important;
         width: 6px !important;
         height: 6px !important;

     }

     .swiper-pagination-bullet-active {
         background: @color  !important;
         width: 20px !important;
         height: 6px !important;
         border-radius: 3px !important;
         opacity: 1 !important;

     }
 }

 header {
     .w(100%);
     margin-bottom: 20px;

     .h-dom {
         .w(100%);
         position: relative;
     }

     .h-dom-c {
         .basew;
         height: 60px;
         padding: 10px 0;
         margin: 0 auto;

         box-sizing: content-box;

         .h-dom-phone {
             height: 100%;
             padding-left: 50px;
             background: url(../img/top-phone.png) no-repeat left center;
             font-size: 23px;
             line-height: 60px;
             color: @color
         }
     }

     .bgblue {

         background: @color;

         .h-dom-c {
             padding: 0;

         }

         li {
             .fl;
             width: (1/6)*100%;
             line-height: 60px;
             text-align: center;
             font-size: 16px;

             letter-spacing: 0.06px;
             background: url(../img/dh-shu.png) no-repeat right;

             a {
                 display: block;
                 width: 100%;
                 height: 100%;
                 color: #ffffff;
             }

             &:hover {
                 opacity: .5;
             }

             &:last-child {
                 background: none
             }
         }
     }
 }


 .banner {
     width: 100%;
     height: 300px;
     margin-bottom: 20px;
 }



 .module {
     .w(320px);
     height: 300px;
     border: 1px solid #cccccc;
     margin-bottom: 20px;


     .basetitel {
         padding: 8px 16px 0;
         margin-bottom: 16px;
         border-bottom: 2px solid @color;
         position: relative;
         background: -webkit-linear-gradient(#ffffff, #dedede);
         /* Safari 5.1 - 6.0 */
         background: -o-linear-gradient(#ffffff, #dedede);
         /* Opera 11.1 - 12.0 */
         background: -moz-linear-gradient(#ffffff, #dedede);
         /* Firefox 3.6 - 15 */
         background: linear-gradient(#ffffff, #dedede);

         /* 标准的语法 */
         .t-text {
             .w(100px);
             .fl;
             line-height: 27px;
             display: inline-block;
             background: @color;
             text-align: center;
             color: #ffffff;
             border-radius: 3px 5px 0 0;
         }

         .more {
             position: absolute;
             top: 9px;
             right: 16px;
             cursor: pointer;
            display: block;
             &:hover {
                 opacity: 0.5;
             }
         }
     }
 }

 .slider-module {
     width: 740px;
     //  height: 539px;
     background: rgba(255, 255, 255, 1);
     border: 1px solid rgba(204, 204, 204, 1);
     .mbt20;
     .news-ul .news-li {
       padding: 0;
       padding: 20px 0;
        height: 18px;;
        font-size: 14px;
        cursor: pointer;
    }
     .batitle {
         line-height: 35px;
         padding: 0 16px;
         margin-bottom: 16px;
         border-bottom: 1px solid rgba(204, 204, 204, 1);
         position: relative;
         background: -webkit-linear-gradient(#ffffff, #dedede);
         /* Safari 5.1 - 6.0 */
         background: -o-linear-gradient(#ffffff, #dedede);
         /* Opera 11.1 - 12.0 */
         background: -moz-linear-gradient(#ffffff, #dedede);
         /* Firefox 3.6 - 15 */
         background: linear-gradient(#ffffff, #dedede);

         .bt-s {
             font-size: 12px;
             color: rgba(0, 0, 0, 1);
             line-height: 18px;
         }

         .bt-s1 {
             font-size: 12px;
             color: rgba(85, 85, 80, 1);
             line-height: 18px;
             position: relative;
             padding-right: 12px;

             &:not(:last-child) {
                 &::before {
                     content: " ";
                     display: inline-block;
                     height: 6px;
                     width: 6px;
                     border-width: 1px 1px 0 0;
                     border-color: rgba(153, 153, 153, 1);
                     border-style: solid;
                     -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
                     transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
                     position: absolute;
                     right: 3px;
                     top: 5px;

                 }
             }
         }
     }

     .slider-md-content {
         padding: 16px;
     }

     .text-center {
         text-align: center
     }

     .ptitle {
         height: 60px;
         line-height: 65px;
         text-align: center;
         font-size: 18px;
         color: rgba(0, 0, 0, 1);
         background: url(../img/gywm-title.png) no-repeat;
         background-position: center bottom;
         .mbt20;
     }

     .pdlTile {
         font-size: 14px;
        //  font-weight: bolder;
         color: #333333;
         .mbt15;
     }

     .pdl {
         text-indent: 24px;
     }

     .plr {
         line-height: 22px;
         font-size: 14px;

         .pl {
             text-align: right;
             display: inline-block;
             color: #000000;
             font-weight: bolder;
             width: 100px;

         }
     }

     .slider-ul-img {
         li {
             margin-bottom: 24px;
            float: left;
             &:nth-child(3n-1) {
                 margin: 0 34px 24px;
             }
             &:nth-child(3n) {
                float: right;
            }
             .img {
                 width: 212px;
                 height: 176px;
                 padding: 2px;
                 border: 1px solid #efefef;
                 .mbt20;
                 overflow: hidden;
                img{
                    width: 100%;
                    height: 100%;
                }
             }

             p {
                 text-align: center
             }
         }
     }

 }

 // 联系我们
 .lxwm {
     .img {
         text-align: center;
         padding: 0 16px 16px;
     }

     p {
         font-size: 12px;
         color: #000000;
         line-height: 1;
         letter-spacing: 0.07px;
         margin-bottom: 16px;
         padding-left: 16px;
     }

     .mt5 {
         margin-bottom: 10px;
     }
 }

 //企业新闻
 .qyxw {
     width: 400px;
     margin-left: 20px;

     .news-box {
         padding: 0 15px;

         .borderbt {
             padding-bottom: 15px;
             border-bottom: 1px dashed #999999;
         }

         .img {
             width: 178px;
             height: 122px;
             background: rgba(255, 255, 255, 1);
             border: 1px solid rgba(204, 204, 204, 1);
             padding: 4px;
             margin-right: 10px;

         }

         .news-box-r {
             width: 180px
         }

         .title {
             font-size: 14px;
             color: rgba(0, 0, 0, 1);
             line-height: 21px;
             margin-bottom: 12px;
             .dh
         }

         .details {
             height: 62px;
             font-size: 12px;
             font-weight: normal;
             color: rgba(85, 85, 85, 1);
             line-height: 20px;
             margin-bottom: 10px;
         }

         .time {
             font-size: 12px;
             color: #555555;
             letter-spacing: 0.07px;
         }
     }




 }

 .news-ul {
     padding: 0 15px 15px;
     font-size: 12px;
     .news-li {
         line-height: 18px;
         padding: 16px 0;
         cursor: pointer;

         &:hover {
             opacity: 0.8;
         }
     }

     .n-title {
         width: 60%;
         float: left;
       
         color: #333333;
         letter-spacing: 0.07px;
         text-align: justify;
         line-height: 18px;
         background-position: 0 4px;
         height: 18px;

         i {
             display: block;
             float: left;
             height: 100%;
             width: 20px;
             background: url('../img/img.png') no-repeat;
             background-position: 0 4px;
         }
     }

     .n-time {
         width: 35%;
         float: right;
         text-align: right
     }
 }

 //公司产品
 .wdcp {
     .banner {
         width: 288px;
         height: 230px;
         padding: 2px;
         border: 1px solid #dedede;

         .swiper-pagination-bullet {
             background: #ffffff !important;
             opacity: 1 !important;
             width: 6px !important;
             height: 6px !important;
         }

         .swiper-pagination-bullet-active {
             background: @color  !important;
             opacity: 1 !important;
         }
         img{
             height: 100%;
         }
     }
 }

 .cqfj {
     height: 272px;
     margin-right: 20px;

     li {
         width: 50%;
         float: left;
         margin-bottom: 10px;

         &:nth-child(2n+1) {
             padding-left: 15px;
         }

         &:nth-child(2n) {
             padding-right: 15px;

             .cqfj-d {
                 float: right;
             }
         }

         .cqfj-d {
             width: 140px;
             height: 98px;
             border: 1px solid rgba(204, 204, 204, 1);
             position: relative;
            overflow: hidden;
             &:nth-child(2n) {
                 margin-right: 0
             }

             p {
                 position: absolute;
                 bottom: 0;
                 left: 0;
                 width: 140px;
                 height: 24px;
                 line-height: 24px;
                 background: rgba(6, 86, 154, 0.7);
                 text-align: center;
                 font-size: 12px;
                 color: #ffffff
             }
         }

     }
 }

 .gsjs {
     width: 740px;
     height: 272px;

     .gsjs-box {
         padding: 0 15px
     }

     .img {
         width: 238px;
         height: 204px;
        //  background: red
        img{
            height: 100%;
        }
     }

     .gsjs-br {
         width: 470px;
         height: 204px;
         padding: 20px 16px 30px;
         box-shadow: 0px 2px 16px 0px rgba(204, 204, 204, 0.5);
         position: relative;
         background: url(../img/gsjs-about.png) no-repeat;
         background-position: 15px 0;
     }

     .gsjs-br-p1 {
         line-height: 46px;
         text-align: center;
         font-size: 16px;
         color: rgba(0, 0, 0, 1);
     }

     .gsjs-br-p2 {
         font-size: 12px;
         color: rgba(85, 85, 85, 1);
         line-height: 18px;
     }

     .gsjs-ul {
         width: 470px;
         height: 29px;
         position: absolute;
         bottom: 0;
         left: 0;
         background: rgba(9, 138, 210, 1);
         box-shadow: 0px 2px 16px 0px rgba(204, 204, 204, 0.5);
     }

     .gsjs-li {
         width: 33.333%;
         height: 100%;
         float: left;
         position: relative;

         &.gsjs-liline {
             &::after {
                 display: block;
                 content: "";
                 width: 1px;
                 height: 14px;
                 background: rgba(149, 202, 232, 1);
                 position: absolute;
                 right: 0;
                 top: 50%;
                 margin-top: -7px;
             }
         }


         a {
             display: block;
             width: 100%;
             height: 100%;
             line-height: 29px;
             text-align: center;
             color: #ffffff;

             i {
                 display: inline-block;
                 height: 100%;
                 width: 20px;
                 background-image: url(../img/img.png);
                 background-repeat: no-repeat;
             }

             .i2 {

                 background-position: -61px 8px;
             }

             .i3 {
                 background-position: -91px 8px;
             }

             .i1 {
                 background-position: -28px 8px;
             }

             span {
                 display: inline-block;
                 vertical-align: top;
             }
         }
     }
 }


 footer {
     .footer-ul {
         height: 30px;
         line-height: 30px;
         background: -webkit-linear-gradient(@color, #03a9f4);
         /* Safari 5.1 - 6.0 */
         background: -o-linear-gradient(@color, #03a9f4);
         /* Opera 11.1 - 12.0 */
         background: -moz-linear-gradient(@color, #03a9f4);
         /* Firefox 3.6 - 15 */
         background: linear-gradient(@color, #03a9f4);
         text-align: center;

         a {
             display: inline-block;
             padding: 0 10px;
             color: #ffffff;
             position: relative;

             &:hover {
                 opacity: 0.5;
             }

             &::after {
                 content: "";
                 display: block;
                 width: 1px;
                 height: 14px;
                 background: #ffffff;
                 position: absolute;
                 right: 0;
                 top: 50%;
                 margin-top: -7px;
             }
         }

     }
    
     .h80 {
         height: 80px;
         margin: 0 auto;
         text-align: center;
         padding: 15px;
         font-size: 12px;
         color: rgba(85, 85, 85, 1);
         a{
            color: rgba(85, 85, 85, 1);
         }
     }
 }
//侧边的内容
 .silderul-module {
     height: auto;

     .basetitel {
         margin-bottom: 0
     }

     .silder-ul {
         li {
             padding-left: 50px;
             line-height: 50px;
             font-size: 15px;
             color: rgba(51, 51, 51, 1);
             border-bottom: 1px solid #cccccc;
             position: relative;
             cursor: pointer;

             &.active,
             &:hover {
                 color: @color;

                 &::before {
                     border-color: @color;
                 }
             }

             &::before {
                 content: " ";
                 display: inline-block;
                 height: 8px;
                 width: 8px;
                 border-width: 1px 1px 0 0;
                 border-color: rgba(153, 153, 153, 1);
                 border-style: solid;
                 -webkit-transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
                 transform: matrix(0.71, 0.71, -0.71, 0.71, 0, 0);
                 position: absolute;
                 right: 50px;
                 top: 22px;
                 cursor: pointer;
             }

             &:last-child {
                 border-bottom: 0
             }
         }
     }
    
 }
//  联系我们页面
 .lxwmpage{
     .lxwm{
         width: 100%;
         
         height: auto;
         p{
             font-size: 14px;
             line-height: 1.5
         }
     }
 }

 //news-details新闻详情
 .news-details{
    padding: 0 16px;
     .news-details-title{
        text-align: center;
         font-size: 16px;
         font-weight: bold;
         line-height: 40px;
         height: 40px;
         .mt25;
     }
     .news-details-time{
        font-size: 14px;
        text-align: center;
        line-height: 20px;
        color: #666666;
        .mbt20;
    }
 }